<template>
	<view>
		<view style="height: 160rpx;box-sizing:border-box; padding-top: 81rpx;background-color: #FF1414;">
					<!-- <image src="/static/waimai/返回@2x.png" @click="backTo()"  mode="aspectFit"></image> -->
			<uni-icons type="arrowleft" size="20" color="#FFFFFF" @click="backTo()" style="margin: 0 259rpx 0 30rpx;"></uni-icons>
			<text style="font-size: 32rpx;color: #fff;">分销中心</text>
		</view>
		<view class="header">
			<view class="nav">
				<view class="left">
					<image :src="avatar"></image>
					<view class="userInfo">
						<text style="font-size: 32rpx;font-weight: bold;">{{username}}</text>
						<text class="userInfo-text">{{rank}}</text>
						<text class="userInfo-text">推荐人：{{inviter}}</text>
						<text class="userInfo-text">邀请码：{{inviteId}}</text>
					</view>
				</view>
				<view class="right">
					<view class="set" @tap="storeSet">
						<image src="@/static/sets.png"></image>
						<text style="padding-left: 10rpx;">小店设置</text>
					</view>
					<view class="tixian">
						<image src="@/static/tixian.png" ></image>
						<text style="padding-left: 10rpx;">佣金提现</text>
					</view>
				</view>
			</view>
			<view class="line"></view>
			<view class="content">
				<view class="item">
					<text>已提现佣金</text>
					<text>0.00</text>
				</view>
				<view class="item" @tap="commission">
					<text>分销佣金</text>
					<text>0.00</text>
				</view>
				<view class="item">
					<text>可提现佣金</text>
					<text>{{money}}</text>
				</view>
			</view>
		</view>
	    <view class="middle">
			<view class="navs">
				<navigator url="/pages/fenxiao/fxdd/fxdd">
					<view class="items">
						<image src="@/static/icon/icon14.png"></image>
						<text>分销订单</text>
						<label>0笔</label>
					</view>
				</navigator>
				<!-- <navigator url="/pages/fenxiao/referrals/referrals"> -->

					<view class="items" @click="toFansPage">
						<image src="@/static/icon/icon15.png"></image>
						<text>我的下线</text>
						<label>0人</label>
					</view>

					
				<!-- </navigator> -->
				<view class="items" @tap="tixian">
					<image src="@/static/icon/icon16.png"></image>
					<text>提现明细</text>
				    <label>0笔</label>
				</view>
			</view>
			<view class="navs">
				<navigator url="/pages/fenxiao/table/table">
					<view class="items">
						<image src="@/static/icon/icon17.png"></image>
						<text>分销报表</text>
					</view>
				</navigator>
				<navigator url="/pages/fenxiao/ranking/ranking">
					<view class="items">
						<image src="@/static/icon/icon18.png"></image>
						<text>分销员排名</text>
					</view>
				</navigator>
				<navigator url="/pages/fenxiao/qrcode/qrcode">
					<view class="items" >
						<image src="@/static/icon/icon19.png"></image>
						<text>推广二维码</text>
					</view>
				</navigator>
				
			</view>
		</view>
	</view>
</template>
<script>
	import {Storage} from '@/static/libs/utils.js'
export default {
	data(){
		return {
			avatar:'',
			username:'',
			rank:'普通等级',//等级
			inviter:'',//推荐人
			inviteId:'',//邀请码
			token:'',
			money:''//可提现佣金
		}
	},
	onLoad() {
		this.token = Storage.get('token')
		this.getUserInfo()
		this.getCommissionInfo()
	},
	methods:{
		// toQrcodePage(){
		// 	uni.navigateTo({
		// 		url:``
		// 	})
		// },
		//获取分销用户信息
		getUserInfo(){
			this.$request
				.post("/wxapp.php?from=wxapp&c=entry&a=wxapp&do=user&m=lionfish_comshop",{
				controller:'user.get_user_info',
				token:this.token
			}).then(res=>{
				console.log('分销用户信息',res)
				this.avatar = res.data.data.avatar
				this.username = res.data.data.full_user_name
			})
		},
		//获取佣金信息
		getCommissionInfo(){
			this.$request.post("/wxapp.php?from=wxapp&c=entry&a=wxapp&do=user&m=lionfish_comshop",{
				controller:'distribution.get_commission_info',
				token:this.token
			}).then(res=>{
				console.log('佣金信息',res)
				this.inviteId = res.data.data.member_id
				this.inviter = res.data.data.share_name
				this.money = res.data.data.money
			})
		},
		toFansPage(){
			uni.navigateTo({
				url:"./referrals/referrals"
			})
		},
		storeSet(){
			uni.navigateTo({
				url:"/pages/storeSet/storeSet"
			})
		},
		tixian(){
			uni.navigateTo({
				url:"/pages/tixian/tixian"
			})
		},
		commission(){
			uni.navigateTo({
				url:"/pages/commission/commission"
			})
		}
	}
}
</script>
<style lang="scss">
.header {
	width: 750rpx;
	// height: 356rpx;
	height: 398rpx;
	background: linear-gradient(180deg, #FF1414 0%, #FF7979 100%);
}
.nav {
	width: 690rpx;
	display: flex;
	flex-direction: row;
	padding-left: 30rpx;
	padding-right: 30rpx;
	padding-top: 42rpx;
	justify-content: space-between;
}
.left {
	display: flex;
	flex-direction: row;
	image {
		width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
	}
	.userInfo {
		display: flex;
		flex-direction: column;
		margin-left: 10rpx;
		justify-content: flex-start;
		color: #FFFFFF;
		font-family: Source Han Sans CN;
		line-height: 40rpx;
	}
}
.right {
	font-size: 28rpx;
	font-family: Source Han Sans CN;
	font-weight: 400;
	color: #FFFFFF;
}
.set {
	width: 177rpx;
	height: 54rpx;
	line-height: 54rpx;
	border: 2rpx solid #FFFFFF;
	border-radius: 10rpx;
	text-align: center;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding-left: 14rpx;
	image {
		width: 30rpx;
		height: 32rpx;
	}
}
.tixian {
	width: 177rpx;
	height: 54rpx;
	line-height: 54rpx;
	border: 2rpx solid #FFFFFF;
	border-radius: 10rpx;
	text-align: center;
	margin-top: 40rpx;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding-left: 14rpx;
	image{
		width: 34rpx;
		height: 30rpx;
	}
}
.line {
	width: 750rpx;
	height: 2rpx;
	margin-top: 53rpx;
	background: #FFFFFF;
	opacity: 0.05;
}
.content {
	width: 650rpx;
	height: 142rpx;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	margin-left: 50rpx;
	margin-right: 50rpx;
}
.item {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	font-size: 24rpx;
	font-family: Source Han Sans CN;
	font-weight: 400;
	color: #FFFFFF;
	line-height: 40rpx;
	}
.middle {
	margin-top: 70rpx;
	.navs {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		align-items: center;
		margin-bottom: 80rpx;
		.items {
			display: flex;
			flex-direction: column;
			align-items: center;
			font-family: Source Han Sans CN;
			font-weight: 400;
			image {
				width: 40rpx;
				height: 40rpx;
			}
			text {
				font-size: 28rpx;
				color: #141414;
				line-height: 80rpx;
			}
			label {
				font-size: 24rpx;
				color: #666666;
			}
		}
	}
}
.userInfo-text{
	font-size: 22rpx;
	font-weight: 400;
}
</style>
